/**
 * Copyright (c) 2020 kedacom
 * OpenATC is licensed under Mulan PSL v2.
 * You can use this software according to the terms and conditions of the Mulan PSL v2.
 * You may obtain a copy of Mulan PSL v2 at:
 * http://license.coscl.org.cn/MulanPSL2
 * THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
 * EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
 * MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
 * See the Mulan PSL v2 for more details.
 **/
<template>
  <div v-if="isShow && isShowNavibar" class="openatc-navbar">
  <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" active-text-color='$--color-primary' @select="handleSelect">
    <div class="openatc-main">OpenATC-Admin</div>
    <div class="openatc-line"></div>
    <div class="openatc-menu">
      <el-menu-item index="home" :style="getParentMenuStyle('home')" @click="onParentMenuClick('home')">
        <span class="el-dropdown-link" :style="getTextStyle('home')">
          <i class="iconfont icon-zhuye1"></i>{{this.menuHome?this.menuHome:$t('openatc.main.homepage')}}
        </span>
      </el-menu-item>
      <el-menu-item index="device" v-if="isHasPermission('openatc:base:intersection')"  :style="getParentMenuStyle('device')" @click="onParentMenuClick('device')">
        <span class="el-dropdown-link" :style="getTextStyle('device')">
          <i class="iconfont icon-lukouguanli1"></i>{{this.menuDevice?this.menuDevice:$t('openatc.main.devicemanager')}}
        </span>
      </el-menu-item>
      <el-menu-item index="statistics" v-if="isHasPermission('openatc:statistics:')" :style="getParentMenuStyle('statistics')" @click="onParentMenuClick('statistics')">
        <el-dropdown trigger="click" @command="handleSelect" placement="bottom">
          <span class="el-dropdown-link" :style="getTextStyle('statistics')">
            <i class="iconfont icon-jiaotongfenxi" :style="getTextStyle('statistics')"></i>
            {{this.menuStatistics?this.menuStatistics:$t('openatc.main.dataanalysis')}}
            <i class="el-icon-arrow-down menu-icon--right" :style="getTextStyle('statistics')"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="basicdata" v-if="isHasPermission('openatc:statistics:base')">
              <i class="iconfont icon-jichushujutongji" :style="dropDownStyle"></i>
              {{this.menuBasicData?this.menuBasicData:$t('openatc.main.basicdatastatistics')}}
            </el-dropdown-item>
            <el-dropdown-item command="operationfrequency" v-if="isHasPermission('openatc:statistics:operation')">
              <i class="iconfont icon-caozuopincitongji" :style="dropDownStyle"></i>
              {{this.menuOperation?this.menuOperation:$t('openatc.operation.operationfrequencyanalysis')}}
            </el-dropdown-item>
            <el-dropdown-item command="devicefault" v-if="isHasPermission('openatc:statistics:operation')">
              <i class="iconfont icon-shebeiguzhangtongji" :style="dropDownStyle"></i>
              {{this.menuDeviceFault?this.menuDeviceFault:$t('openatc.devicefault.devicefailurestatistics')}}
            </el-dropdown-item>
            <el-dropdown-item command="platformstatistics" v-if="isHasPermission('openatc:statistics:operation')">
              <i class="iconfont icon-pingtaicaozuotongji" :style="dropDownStyle"></i>
              {{this.menuPlatform?this.menuPlatform:$t('openatc.platformrecord.platformstatistics')}}
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-menu-item>
      <el-menu-item index="routeOptimize" v-if="isHasPermission('openatc:optimization:route')"  :style="getParentMenuStyle('route')" @click="onParentMenuClick('route')">
        <span class="el-dropdown-link" :style="getTextStyle('route')">
          <i class="iconfont icon-luxianguanli1"></i>{{this.menuRouteOptimize?this.menuRouteOptimize:$t('openatc.main.routeOptimize')}}
        </span>
      </el-menu-item>
      <el-menu-item index="dutyroute" v-if="isHasPermission('openatc:interrupt:vip')"  :style="getParentMenuStyle('dutyroute')" @click="onParentMenuClick('dutyroute')">
        <span class="el-dropdown-link" :style="getTextStyle('dutyroute')">
          <i class="iconfont icon-qinwuluxian"></i>{{this.menuDutyroute?this.menuDutyroute:$t('openatc.main.dutyroute')}}
        </span>
      </el-menu-item>
      <el-menu-item index="gis" v-if="isShowGisMenu && isHasPermission('openatc:gis')" :style="getParentMenuStyle('gis')" @click="onParentMenuClick('gis')">
        <el-dropdown trigger="click" @command="handleSelect" placement="bottom">
          <span class="el-dropdown-link" :style="getTextStyle('gis')">
            <i class="iconfont icon-lukou" :style="getTextStyle('gis')"></i>
            {{this.menuGis?this.menuGis:$t('openatc.main.gis')}}
            <i class="el-icon-arrow-down menu-icon--right" :style="getTextStyle('gis')"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="deviceState">
              <i class="iconfont icon-shebeizhuangtai" :style="dropDownStyle"></i>
              {{this.menuGisDevice?this.menuGisDevice:$t('openatc.gis.deviceState')}}
            </el-dropdown-item>
            <el-dropdown-item command="dutyRoute" v-if="isHasPermission('openatc:interrupt:vip')">
              <i class="iconfont icon-teqinluxian" :style="dropDownStyle"></i>
              {{this.menuGisDutyRoute?this.menuGisDutyRoute:$t('openatc.gis.dutyRoute')}}
            </el-dropdown-item>
            <el-dropdown-item command="coordinateRoute" v-if="isHasPermission('openatc:optimization:route')">
              <i class="iconfont icon-xietiaoluxian1" :style="dropDownStyle"></i>
              {{this.menuGisCoordinateRoute?this.menuGisCoordinateRoute:$t('openatc.gis.coordinateRoute')}}
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-menu-item>
      <el-menu-item index="logs" v-if="isHasPermission('openatc:logs:')" :style="getParentMenuStyle('logs')" @click="onParentMenuClick('logs')">
        <el-dropdown trigger="click" @command="handleSelect" placement="bottom">
          <span class="el-dropdown-link" :style="getTextStyle('logs')">
            <i class="iconfont icon-pingjia" :style="getTextStyle('logs')"></i>
            {{this.menuLogs?this.menuLogs:$t('auth.permission.openatc:logs:*')}}
            <i class="el-icon-arrow-down menu-icon--right" :style="getTextStyle('logs')"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="operate" v-if="isHasPermission('openatc:logs:operation')">
              <i class="iconfont icon-caozuojilu" :style="dropDownStyle"></i>
              {{this.menuOperateRecord?this.menuOperateRecord:$t('openatc.main.operationrecord')}}
            </el-dropdown-item>
            <el-dropdown-item command="faultrecord" v-if="isHasPermission('openatc:logs:fault')">
              <i class="iconfont icon-guzhangjilu" :style="dropDownStyle"></i>
              {{this.menuFaultRecord?this.menuFaultRecord:$t('openatc.main.faultrecord')}}
            </el-dropdown-item>
             <el-dropdown-item command="platformrecord" v-if="isHasPermission('openatc:logs:web_operation')">
              <i class="iconfont icon-pingtaijilu" :style="dropDownStyle"></i>
              {{this.menuPlatformRecord?this.menuPlatformRecord:$t('openatc.gis.platformrecording')}}
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-menu-item>
      <el-menu-item index="auth" v-if="isShowMenu('user') && isHasPermission('openatc:auth:')" :style="getParentMenuStyle('auth')" @click="onParentMenuClick('auth')">
        <el-dropdown trigger="click" @command="handleSelect" placement="bottom">
          <span class="el-dropdown-link" :style="getTextStyle('auth')">
            <i class="iconfont icon-quanxianguanli"  :style="getTextStyle('auth')"></i>
            {{this.menuAuth?this.menuAuth:$t('openatc.main.auth')}}
            <i class="el-icon-arrow-down menu-icon--right" :style="getTextStyle('auth')"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="organization" v-if="isHasPermission('openatc:auth:organization')">
              <i class="iconfont icon-zuzhijigou" :style="dropDownStyle"></i>
              {{this.menuOrganization?this.menuOrganization:$t('openatc.main.organization')}}
            </el-dropdown-item>
            <el-dropdown-item command="user" v-if="isHasPermission('openatc:auth:user')">
              <i class="iconfont icon-yonghuguanli" :style="dropDownStyle"></i>
              {{this.menuUsermanager?this.menuUsermanager:$t('openatc.main.usermanager')}}
            </el-dropdown-item>
            <el-dropdown-item command="role" v-if="isHasPermission('openatc:auth:role')">
              <i class="iconfont icon-jiaoseshezhi" :style="dropDownStyle"></i>
              {{this.menuRole?this.menuRole:$t('auth.route.role')}}
            </el-dropdown-item>
            <el-dropdown-item command="permission" v-if="isHasPermission('openatc:auth:permission')">
              <i class="iconfont icon-quanxianshezhi" :style="dropDownStyle"></i>
              {{this.menuPermission?this.menuPermission:$t('auth.route.permission')}}
            </el-dropdown-item>
            <el-dropdown-item command="systemsettings" v-if="isHasPermission('openatc:auth:setting')">
              <i class="iconfont icon-zhuye" :style="dropDownStyle"></i>
              {{this.menuSystemsettings?this.menuSystemsettings:$t('openatc.main.systemsettings')}}
            </el-dropdown-item>
            <el-dropdown-item command="thirdPlatform" v-if="isHasPermission('openatc:auth:third_platform')">
              <i class="iconfont icon-xietiaoluxian" :style="dropDownStyle"></i>
              {{this.menuThirdPlatform?this.menuThirdPlatform:$t('openatc.devicemanager.thirdPlatform')}}
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-menu-item>
    </div>
    <div class="openatc-operate">
      <div class="admin">
        <el-dropdown trigger="click"
                     :hide-on-click= "false"
                     @command="handleCommand"
                     @visible-change="showInfo">
          <span class="el-dropdown-link">
            {{userInfo.user_name}}<i class="el-icon-arrow-down el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item disabled>
              <div class="user-name">{{userInfo.user_name}}</div>
              <div style="margin-top: 10px;">
                <span v-for="(data, index) in userInfo.roleNames" :key="index">
                  <el-tag size="medium" :type="roleType[index]">{{ data }}</el-tag>
                </span>
              </div>
            </el-dropdown-item>
            <el-dropdown-item divided disabled>
              <div class="organization">
                <div class="laber-name">{{$t('openatc.main.organization')}}</div>
                <div class="laber-value">{{userInfo.organization}}</div>
              </div>
              <div class="real-name">
                <div class="laber-name">{{$t('openatc.main.realname')}}</div>
                <div class="laber-value">{{userInfo.nick_name}}</div>
              </div>
              <div class="real-name">
                <div class="laber-name">{{$t('openatc.usermanager.ip')}}</div>
                <div class="laber-value">{{userInfo.user_ip}}</div>
              </div>
            </el-dropdown-item>
            <el-dropdown-item divided disabled>
              <div class="organization">
                <div class="laber-name">{{$t('openatc.main.telno')}}</div>
                <div class="laber-value">{{userInfo.mobile_phone}}</div>
              </div>
              <div class="real-name">
                <div class="laber-name">{{$t('openatc.main.email')}}</div>
                <div class="laber-value">{{userInfo.email}}</div>
              </div>
            </el-dropdown-item>
            <el-dropdown-item divided command="switchTheme">
              <el-dropdown trigger="click" @command="switchTheme">
                <span class="el-dropdown-link">
                  {{$t('openatc.main.skin')}}<i class="el-icon-arrow-down el-icon--right"></i>
                </span>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item command="dark">{{$t('openatc.main.dark')}}</el-dropdown-item>
                  <el-dropdown-item command="light">{{$t('openatc.main.light')}}</el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </el-dropdown-item>
            <el-dropdown-item command="switchTheme">
              <el-dropdown trigger="click" @command="switchLanguage">
                <span class="el-dropdown-link">
                  {{$t('openatc.main.language')}}<i class="el-icon-arrow-down el-icon--right"></i>
                </span>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item command="Ch">中文</el-dropdown-item>
                  <el-dropdown-item command="En">English</el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </el-dropdown-item>
            <el-dropdown-item divided command="changepass">{{$t('openatc.main.changepass')}}</el-dropdown-item>
            <!-- <el-dropdown-item command="systemsettings">{{$t('openatc.main.systemsettings')}}</el-dropdown-item>
            <el-dropdown-item command="thirdPlatform">{{$t('openatc.devicemanager.thirdPlatform')}}</el-dropdown-item> -->
            <el-dropdown-item command="help">{{$t('openatc.main.help')}}</el-dropdown-item>
            <el-dropdown-item command="about">{{$t('openatc.main.about')}}</el-dropdown-item>
            <el-dropdown-item command="signout">{{$t('openatc.main.signout')}}</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
    </div>
      <el-drawer
        :title="$t('openatc.faultrecord.faultlist')"
        :visible.sync="drawer"
        :modal="false"
        :with-header="true">
        <div class="isopen">
          {{ $t("openatc.faultrecord.isopen") }}:
          <el-switch
            style="padding-left: 5px;"
            v-model="isOpen"
            active-value="true"
            inactive-value="false"
            active-color="#299BCC">
          </el-switch>
        </div>
          <div class="empty" v-show="faultData.length === 0">
            <img src="../../../../static/img/noMessage.png">
            <div class="noInfo">{{ $t("openatc.faultrecord.message") }}</div>
          </div>
          <el-card v-for="(fault,index) in faultData" :key="index" class="box-card" style="margin:10px 16px">
            <div class="text item">
              <el-row :gutter="20" class="row-bg">
                <el-col :span="24">
                  <el-row :gutter="0">
                    <el-col :span="5">
                      <div class="grid-content-label">
                        {{ $t("openatc.faultrecord.eportingmodule") }}:
                      </div>
                    </el-col>
                    <el-col :span="19">
                      <div class="grid-content bg-purple">
                       {{formatterModel(fault.model)}}
                      </div>
                    </el-col>
                  </el-row>
                </el-col>
              </el-row>
              <el-row :gutter="20" class="row-bg">
                <el-col :span="24">
                  <el-row :gutter="0">
                    <el-col :span="5">
                      <div class="grid-content-label">
                        {{ $t("openatc.faultrecord.roadname") }}:
                      </div>
                    </el-col>
                    <el-col :span="19">
                      <div class="grid-content bg-purple">
                        {{fault.name?fault.name:fault.agentid}}
                      </div>
                    </el-col>
                  </el-row>
                </el-col>
              </el-row>
              <el-row :gutter="20"  class="row-bg">
                <el-col :span="24">
                  <el-row :gutter="0">
                    <el-col :span="5">
                      <div class="grid-content-label">
                        {{ $t("openatc.faultrecord.eventtype") }}:
                      </div>
                    </el-col>
                    <el-col :span="19">
                      <div class="grid-content bg-purple">
                        {{ formatterInfotype(fault.eventType)}}
                      </div>
                    </el-col>
                  </el-row>
                </el-col>
              </el-row>
              <el-row :gutter="20" class="row-bg">
                <el-col :span="24">
                  <el-row :gutter="0">
                    <el-col :span="5">
                      <div class="grid-content-label">
                        {{ $t("openatc.faultrecord.detaileddescription") }}:
                      </div>
                    </el-col>
                    <el-col :span="19">
                      <div class="grid-content bg-purple">
                        {{ formmatter(fault) }}
                      </div>
                    </el-col>
                  </el-row>
                </el-col>
              </el-row>
            </div>
            <div  class="btnBottom">
              <el-button size="mini" icon="el-icon-circle-check" type="text" @click="cancels(fault)">{{$t('openatc.faultrecord.confirm')}}</el-button>
              <el-button type="text" icon="el-icon-remove-outline" size="mini" @click="confirmeds(fault)">{{$t('openatc.faultrecord.neglect')}}</el-button>
            </div>
          </el-card>
      </el-drawer>
    <div class="alarm-message" @click="drawer = true, isDot=false, getCurrent()">
      <el-badge :is-dot="isDot" class="item">
        <img style ="width: 18px;" src="../../../assets/home/notice.png">
      </el-badge>
    </div>
  </el-menu>
  <modifypasswd ref="modifypasswdChild"></modifypasswd>
  <versioninfo ref="versioninfoChild"></versioninfo>
  <!-- <SystemSettings ref="settinngChild"></SystemSettings> -->
  <!-- <ThirdPlatform ref="thirdPlatform"></ThirdPlatform> -->
  </div>
</template>
<script>
// import router from '../../../router'
import FaultEventData from '../../../model/EventModal/faultData.js'
import { GetFaultRange, enumerateCheck } from '../../../api/fault.js'
// import modifypasswd from './modifyPasswd'
import modifypasswd from './ChangePass'
import versioninfo from './versionInfo'
// import SystemSettings from './SystemSettings'
// import ThirdPlatform from './ThirdPlatform'
import { mapState } from 'vuex'
import { getInfo } from '../../../api/login'
import { SystemconfigApi } from '../../../api/systemconfig.js'
import { setFault, getFault } from '../../../utils/crossFilterMgr'
import { setLanguage, getTheme, setTheme, hasPermission, getIsShowMenu, getMenuVisible } from '../../../utils/auth'
import { getMessageByCode } from '../../../utils/responseMessage'
// import { SystemconfigApi } from '../../../api/systemconfig.js'
import { formatFaultDescValue, getMainFaultType, getMainFaultTypeEn } from '../../../utils/fault.js'
import { InitWSSubMgr } from '../../../model/wsInit.js'
import { sendTokenVerify } from '../../../utils/wsVerifyToken.js'
export default {
  name: 'navbar',
  components: { modifypasswd, versioninfo },
  data () {
    return {
      menuUsermanager: '',
      menuRole: '',
      menuPermission: '',
      menuSystemsettings: '',
      menuThirdPlatform: '',
      menuOrganization: '',
      menuPlatformRecord: '',
      menuFaultRecord: '',
      menuOperateRecord: '',
      menuGisDevice: '',
      menuGisDutyRoute: '',
      menuGisCoordinateRoute: '',
      menuDutyroute: '',
      menuRouteOptimize: '',
      menuDeviceFault: '',
      menuPlatform: '',
      menuOperation: '',
      menuBasicData: '',
      menugreenwave: '',
      menuDevice: '',
      menuHome: '',
      menuBase: '',
      menuStatistics: '',
      menuOptimization: '',
      menuInterrupt: '',
      menuGis: '',
      menuLogs: '',
      menuAuth: '',
      dropDownStyle: {
        'color': getTheme() === 'light' ? '#666666' : '#B9BABF',
        'font-size': '14px'
      },
      parentMenuStyle: {
        display: 'inline-block',
        background: getTheme() === 'light' ? '#299BCC' : '#299BCC'
      },
      defaultMenuStyle: {
        display: 'inline-block'
      },
      textStyle: {
        color: getTheme() === 'light' ? '#FFFFFF' : '#FFFFFF'
      },
      notShowMenus: [],
      faultData: [],
      activeIndex: '',
      drawer: false,
      isOpen: true,
      routerPath: {
        home: '/home',
        gis: '/gis',
        device: '/device',
        user: '/user',
        role: '/role',
        systemsettings: '/setting',
        thirdPlatform: '/thirdPlatform',
        permission: '/permission',
        greenwave: '/greenWaveOptimize',
        basicdata: '/basicdata',
        operationfrequency: '/operationfrequency',
        devicefault: '/devicefault',
        platformstatistics: '/platformstatistics',
        operate: '/operaterecord',
        organization: '/organization',
        dutyroute: '/dutyroute',
        platformrecord: '/platformrecord',
        routeOptimize: '/routeOptimize',
        faultrecord: '/faultrecord'
      },
      roleType: ['', 'success', 'warning'],
      isShow: true,
      fromKstpPath: ['/greenWaveOptimizeNew', '/deviceNew', '/operaterecordNew', '/overviewNew/index'],
      language: 'Language',
      zh_handbook: '',
      en_handbook: '',
      pageNum: '1',
      pageSize: '10',
      enumerate: '0',
      isCurrentFault: false,
      infotype: '',
      model: '',
      notify: undefined,
      faultDescValue: '',
      roadName: '',
      faultDatas: '',
      isDot: false,
      // faultLevelMap: new Map([[1, '一般故障'], [2, '降级故障'], [3, '严重故障']]),
      // faultLevelMapEn: new Map([[1, 'General failure'], [2, 'Degradation failure'], [3, 'Serious failure']]),
      TZParamSubtypeMap: new Map([[0, ''], [1, '特征参数不存在'], [2, '特征参数文件不可读'], [3, '特征参数人为修改'], [4, '特征参数文件打开失败'], [5, '特征参数文件更新失败'], [6, '信号机地址码校验失败'], [7, '特征参数内容格式错误'], [8, 'USB挂载失败']]),
      TZParamSubtypeMapEn: new Map([[0, ''], [1, 'Non-existent'], [2, 'File Is Unreadable'], [3, 'File Artificial Changes'], [4, 'File Open Fail'], [5, 'File Update Fail'], [6, 'File Check SiteID Fail'], [7, 'Format Error'], [8, 'USB Mount Fail']]),
      greenLampSubtypeMap: new Map([[0, ''], [1, '未输出有效电压'], [2, '输出电压低于输入电压过多'], [3, '输出电压高于输入电压'], [4, '关闭输出但实际电压仍然输出'], [5, '关闭输出但实际电压部分输出'], [6, '线路残留电压过高']]),
      greenLampSubtypeMapEn: new Map([[0, ''], [1, 'Output Volatage Is Fail'], [2, 'Output Volatage Is Low'], [3, 'Output Volatage Is High'], [4, 'Off Output Volatage Is high'], [5, 'Off Output Volatage Is low'], [6, 'Residual Voltage Is Over-High']]),
      lampPowerSubtypeMap: new Map([[0, ''], [1, '功率异常增加'], [2, '功率异常减少'], [3, '功率无输出'], [4, '关闭状态有功率输出']]),
      lampPowerSubtypeMapEn: new Map([[0, ''], [1, 'Output Power Is Up'], [2, 'Output Power Is Down'], [3, 'Output Power Is Zero'], [4, 'Off Output Power Is High']]),
      lampgroupfailureMap: new Map([[0, ''], [1, '红灯故障'], [2, '黄灯故障'], [3, '绿灯故障']]),
      lampgroupfailureMapEn: new Map([[0, ''], [1, 'Red light failure'], [2, 'Yellow light failure'], [3, 'Green light failure']])
    }
  },
  watch: {
    isOpen: {
      handler: (filter) => {
        setFault(filter)
      },
      deep: true
    },
    $route: {
      handler: function (val, oldVal) {
        this.setActive(val.path)
      },
      // 深度观察监听
      deep: true
    }
  },
  computed: {
    ...mapState({
      tittle: state => state.globalVariable.logo,
      userInfo: state => state.user.userInfo,
      operateId: state => state.globalVariable.operateId,
      devicePath: state => state.globalVariable.devicePath,
      // isShowGisMenu: state => state.globalVariable.isShowGisMenu,
      // isShowNavibar: state => state.globalVariable.isShowMenu
      activeMenuName: state => state.globalVariable.activeMenuName
    }),
    userInfo: {
      get: function () {
        return this.$store.state.user.userInfo
      },
      set: function (newValue) {
        this.$store.state.user.userInfo = newValue
      }
    },
    isShowGisMenu () {
      let res = true
      let isShowMenu = getMenuVisible('gis')
      if (isShowMenu === 'false') {
        res = false
      }
      return res
    },
    isShowNavibar () {
      let res = true
      let isShowMenu = getIsShowMenu()
      if (isShowMenu === 'false') {
        res = false
      }
      return res
    }
  },
  created () {
    this.isOpen = getFault('isOpen')
    this.setActive()
    if (this.fromKstpPath.indexOf(this.devicePath) !== -1) {
      this.isShow = false
    }
    let href = window.location.href
    if (href.includes('home')) {
      this.$store.dispatch('SetActiveMenuName', 'home')
    }
    this.getUntreated()
    this.showInfo(true)
    this.getMemu()
  },
  mounted () {
    InitWSSubMgr(this.$store).then(() => {
      sendTokenVerify(this.$store, this.verifyTokenRecvMessage)
    })
    if (getTheme() === 'dark') {
      require('../../../styles/dark/theme/element-dark.scss')
    } else {
      require('../../../styles/light/theme/element-light.scss')
    }
  },
  methods: {
    getMemu () {
      return new Promise((resolve, reject) => {
        let reqData = {
          module: 'menu',
          isValid: true
        }
        SystemconfigApi.GetSystemconfigList(reqData).then((data) => {
          let res = data.data
          if (!res.success) {
            console.log('datas:' + res)
            throw new Error('get JupyterUrl error')
          } else {
            for (let config of data.data.data) {
              if (config['key'] === 'home') {
                this.menuHome = config['value']
              }
              if (config['key'] === 'base') {
                this.menuBase = config['value']
              }
              if (config['key'] === 'statistics') {
                this.menuStatistics = config['value']
              }
              if (config['key'] === 'optimization') {
                this.menuOptimization = config['value']
              }
              if (config['key'] === 'interrupt') {
                this.menuInterrupt = config['value']
              }
              if (config['key'] === 'gis') {
                this.menuGis = config['value']
              }
              if (config['key'] === 'logs') {
                this.menuLogs = config['value']
              }
              if (config['key'] === 'auth') {
                this.menuAuth = config['value']
              }
              if (config['key'] === 'device') {
                this.menuDevice = config['value']
              }
              if (config['key'] === 'greenWaveOptimize') {
                this.menugreenwave = config['value']
              }
              if (config['key'] === 'basicdata') {
                this.menuBasicData = config['value']
              }
              if (config['key'] === 'operationfrequency') {
                this.menuOperation = config['value']
              }
              if (config['key'] === 'devicefault') {
                this.menuDeviceFault = config['value']
              }
              if (config['key'] === 'platformstatistics') {
                this.menuPlatform = config['value']
              }
              if (config['key'] === 'dutyroute') {
                this.menuDutyroute = config['value']
              }
              if (config['key'] === 'routeOptimize') {
                this.menuRouteOptimize = config['value']
              }
              if (config['key'] === 'gisCoordinateRoute') {
                this.menuGisCoordinateRoute = config['value']
              }
              if (config['key'] === 'gisDutyRoute') {
                this.menuGisDutyRoute = config['value']
              }
              if (config['key'] === 'gisDevice') {
                this.menuGisDevice = config['value']
              }
              if (config['key'] === 'operaterecord') {
                this.menuOperateRecord = config['value']
              }
              if (config['key'] === 'faultrecord') {
                this.menuFaultRecord = config['value']
              }
              if (config['key'] === 'platformrecord') {
                this.menuPlatformRecord = config['value']
              }
              if (config['key'] === 'organization') {
                this.menuOrganization = config['value']
              }
              if (config['key'] === 'user') {
                this.menuUsermanager = config['value']
              }
              if (config['key'] === 'role') {
                this.menuRole = config['value']
              }
              if (config['key'] === 'permission') {
                this.menuPermission = config['value']
              }
              if (config['key'] === 'setting') {
                this.menuSystemsettings = config['value']
              }
              if (config['key'] === 'thirdPlatform') {
                this.menuThirdPlatform = config['value']
              }
            }
            resolve(data.data.data)
          }
        })
      })
    },
    onParentMenuClick (name) {
      this.$store.dispatch('SetActiveMenuName', name)
    },
    getTextStyle (name) {
      let style = this.activeMenuName === name ? this.textStyle : {}
      return style
    },
    getParentMenuStyle (name) {
      console.log(this.activeMenuName)
      let style = this.activeMenuName === name ? this.parentMenuStyle : this.defaultMenuStyle
      return style
    },
    verifyTokenRecvMessage (message) {
      if (!message.success) {
        if (message.code === '3015') {
          let ssSubMgr = this.$store.getters['wsSubMgr']
          ssSubMgr.closeAllSub()
          return
        }
      }
      this.FaultEventData = new FaultEventData()
      this.FaultEventData.Init(this.handleFaultEventData)
    },
    isHasPermission (path) {
      let res = hasPermission(path)
      return res
    },
    formatterModel (val) {
      let res = ''
      if (val === 'asc') {
        res = this.$t('openatc.faultrecord.asc')
      } else if (val === 'patterncalc') {
        res = this.$t('openatc.faultrecord.patterncalc')
      } else if (val === 'monitor') {
        res = this.$t('openatc.faultrecord.monitor')
      }
      return res
    },
    formatterInfotype (val) {
      let res = ''
      if (val === 'status/fault') {
        res = this.$t('openatc.faultrecord.statusfault')
      }
      return res
    },
    formmatter (data) {
      let value = ''
      if (this.$i18n.locale === 'en') {
        if (data.m_wFaultType === 103) {
          value = data.m_byFaultDescValue + getMainFaultTypeEn(data.m_wFaultType) + this.TZParamSubtypeMapEn.get(data.m_wSubFaultType)
          return value
        } else if (data.m_wFaultType === 208 || data.m_wFaultType === 207 || data.m_wFaultType === 206) {
          value = data.m_byFaultDescValue + getMainFaultTypeEn(data.m_wFaultType) + this.greenLampSubtypeMapEn.get(data.m_wSubFaultType)
          return value
        } else if (data.m_wFaultType === 211 || data.m_wFaultType === 210 || data.m_wFaultType === 209) {
          value = data.m_byFaultDescValue + getMainFaultTypeEn(data.m_wFaultType) + this.lampPowerSubtypeMapEn.get(data.m_wSubFaultType)
          return value
        } else if (data.m_wFaultType === 212) {
          value = data.m_byFaultDescValue + getMainFaultTypeEn(data.m_wFaultType) + this.lampgroupfailureMapEn.get(data.m_wSubFaultType)
        } else {
          value = data.m_byFaultDescValue + getMainFaultTypeEn(data.m_wFaultType)
          return value
        }
      } else {
        if (data.m_wFaultType === 103) {
          value = data.m_byFaultDescValue + getMainFaultType(data.m_wFaultType) + this.TZParamSubtypeMap.get(data.m_wSubFaultType)
          return value
        } else if (data.m_wFaultType === 208 || data.m_wFaultType === 207 || data.m_wFaultType === 206) {
          value = data.m_byFaultDescValue + getMainFaultType(data.m_wFaultType) + this.greenLampSubtypeMap.get(data.m_wSubFaultType)
          return value
        } else if (data.m_wFaultType === 211 || data.m_wFaultType === 210 || data.m_wFaultType === 209) {
          value = data.m_byFaultDescValue + getMainFaultType(data.m_wFaultType) + this.lampPowerSubtypeMap.get(data.m_wSubFaultType)
          return value
        } else if (data.m_wFaultType === 212) {
          value = data.m_byFaultDescValue + getMainFaultType(data.m_wFaultType) + this.lampgroupfailureMap.get(data.m_wSubFaultType)
          return value
        } else {
          value = data.m_byFaultDescValue + getMainFaultType(data.m_wFaultType)
          return value
        }
      }
    },
    handleFaultEventData (data) {
      if (data.success === false && data.code === '3015') return
      this.isDot = true
      this.faultDatas = data
      this.roadName = data.agentid
      this.infotype = this.formatterInfotype(data.infotype)
      this.model = this.formatterModel(data.model)
      if (this.$i18n.locale === 'en') {
        if (data.data.m_FaultDeque[0].m_wFaultType === 103) {
          this.faultDescValue = getMainFaultTypeEn(data.data.m_FaultDeque[0].m_wFaultType) + this.TZParamSubtypeMapEn.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data.m_FaultDeque[0], this.$i18n)
        } else if (data.data.m_FaultDeque[0].m_wFaultType === 208 || data.data.m_FaultDeque[0].m_wFaultType === 207 || data.data.m_FaultDeque[0].m_wFaultType === 206) {
          this.faultDescValue = getMainFaultTypeEn(data.data.m_FaultDeque[0].m_wFaultType) + this.greenLampSubtypeMapEn.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data.m_FaultDeque[0], this.$i18n)
        } else if (data.data.m_FaultDeque[0].m_wFaultType === 211 || data.data.m_FaultDeque[0].m_wFaultType === 210 || data.data.m_FaultDeque[0].m_wFaultType === 209) {
          this.faultDescValue = getMainFaultTypeEn(data.data.m_FaultDeque[0].m_wFaultType) + this.lampPowerSubtypeMapEn.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data.m_FaultDeque[0], this.$i18n)
        } else if (data.data.m_FaultDeque[0].m_wFaultType === 212) {
          this.faultDescValue = getMainFaultTypeEn(data.data.m_FaultDeque[0].m_wFaultType) + this.lampgroupfailureMapEn.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data.m_FaultDeque[0], this.$i18n)
        } else {
          this.faultDescValue = getMainFaultTypeEn(data.data.m_FaultDeque[0].m_wFaultType)
        }
      } else {
        if (data.data.m_FaultDeque[0].m_wFaultType === 103) {
          this.faultDescValue = getMainFaultType(data.data.m_FaultDeque[0].m_wFaultType) + this.TZParamSubtypeMap.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data, this.$i18n)
        } else if (data.data.m_FaultDeque[0].m_wFaultType === 208 || data.data.m_FaultDeque[0].m_wFaultType === 207 || data.data.m_FaultDeque[0].m_wFaultType === 206) {
          this.faultDescValue = getMainFaultType(data.data.m_FaultDeque[0].m_wFaultType) + this.greenLampSubtypeMap.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data, this.$i18n)
        } else if (data.data.m_FaultDeque[0].m_wFaultType === 211 || data.data.m_FaultDeque[0].m_wFaultType === 210 || data.data.m_FaultDeque[0].m_wFaultType === 209) {
          this.faultDescValue = getMainFaultType(data.data.m_FaultDeque[0].m_wFaultType) + this.lampPowerSubtypeMap.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data, this.$i18n)
        } else if (data.data.m_FaultDeque[0].m_wFaultType === 212) {
          this.faultDescValue = getMainFaultType(data.data.m_FaultDeque[0].m_wFaultType) + this.lampgroupfailureMap.get(data.data.m_FaultDeque[0].m_wSubFaultType) + formatFaultDescValue(data.data, this.$i18n)
        } else {
          this.faultDescValue = getMainFaultType(data.data.m_FaultDeque[0].m_wFaultType)
        }
      }
      if (this.notify) {
        this.notify.close()
      }
      if (this.isOpen === 'true' && this.isHasPermission('openatc:logs:fault')) {
        this.open2()
      }
    },
    getCurrent () {
      this.getUntreated()
    },
    open2 () {
      const h = this.$createElement
      this.notify = this.$notify({
        title: this.$t('openatc.faultrecord.realtimealert'),
        iconClass: 'warnIcon',
        onClose: () => {
        },
        dangerouslyUseHTMLString: true,
        message: h('div', {style: {'width': '236px'}}, [
          h('div', {style: {padding: '5px 0'}}, [
            h('span', {class: 'msgTitle'}, `${this.$t('openatc.faultrecord.eportingmodule')}:`),
            h('span', {class: 'msgValue'}, `${this.model}`)
          ]),
          h('div', [
            h('span', {class: 'msgTitles'}, `${this.$t('openatc.faultrecord.roadname')}:`),
            h('span', {class: 'msgValue'}, `${this.roadName}`)
          ]),
          h('div', {class: 'msgTitle'}, [
            h('span', `${this.$t('openatc.faultrecord.eventtype')}:`),
            h('span', {class: 'msgValue'}, `${this.infotype}`)
          ]),
          h('div', {class: 'msgTitleEventtype'}, [
            h('span', `${this.$t('openatc.faultrecord.detaileddescription')}:`),
            h('span', {class: 'msgValue'}, `${this.faultDescValue}`)
          ]),
          h('div', {class: 'borderStyle'}, [
            h('el-button', {props: {size: 'mini', type: 'text', icon: 'el-icon-circle-check'}, on: {click: this.confirm}}, `${this.$t('openatc.faultrecord.confirm')}`),
            h('el-button', {props: {size: 'mini', type: 'text', icon: 'el-icon-remove-outline'}, on: {click: this.cancel}}, `${this.$t('openatc.faultrecord.neglect')}`)
          ])
        ]),
        duration: 0,
        position: 'bottom-right'
      })
    },
    cancel () {
      this.enumerate = '1'
      enumerateCheck(this.faultDatas.agentid, this.faultDatas.data.m_FaultDeque[0].m_wFaultID.toString(), this.enumerate).then(data => {
      })
      this.notify.close()
    },
    confirm () {
      this.enumerate = '2'
      enumerateCheck(this.faultDatas.agentid, this.faultDatas.data.m_FaultDeque[0].m_wFaultID.toString(), this.enumerate).then(data => {
      })
      this.notify.close()
    },
    cancels (data) {
      this.enumerate = '2'
      enumerateCheck(data.agentid, data.m_wFaultID.toString(), this.enumerate).then(data => {
        if (data.data.success) {
          this.getUntreated()
        }
      })
    },
    confirmeds (data) {
      this.enumerate = '1'
      enumerateCheck(data.agentid, data.m_wFaultID.toString(), this.enumerate).then(data => {
        if (data.data.success) {
          this.getUntreated()
        }
      })
    },
    getUntreated () {
      let reqData = {
        'enumerate': '0',
        'isCurrentFault': true
      }
      GetFaultRange(reqData).then(data => {
        if (data.data.success) {
          this.faultData = data.data.data.content
        }
      })
    },
    handleJump (key) {
      this.$router.push({
        path: this.routerPath[key]
      })
    },
    setGisBiz (key) {
      if (key === 'deviceState' || key === 'dutyRoute' || key === 'coordinateRoute') {
        this.$store.dispatch('SetGisBizType', key)
      } else if (key === 'gis') {
        this.$store.dispatch('SetGisBizType', 'deviceState')
      }
    },
    handleSelect (key) {
      this.setGisBiz(key)
      let keys = Object.keys(this.routerPath)
      if (!keys.includes(key)) {
        return false
      }
      this.handleSaveTscParam()
      this.handleJump(key)
      this.$store.dispatch('SetOperatedDeviceId', undefined)
    },
    handleCommand (command) {
      switch (command) {
        case 'changepass': this.modifyPasswd()
          break
        case 'help': this.showHelp()
          break
        case 'about': this.showVersion()
          break
        case 'signout': this.logout()
          break
        // case 'systemsettings': this.showSettings()
          // break
        // case 'thirdPlatform': this.showThirdPlatform()
          // break
        case 'switchTheme':
          break
        case 'switchLanguage':
          break
        default: this.$.push({ path: '/' })
      }
    },
    // getSystemConfig () {
    //   return new Promise((resolve, reject) => {
    //     let reqData = {
    //       module: 'system',
    //       isValid: true
    //     }
    //     SystemconfigApi.GetSystemconfigList(reqData).then((data) => {
    //       if (data.data.success !== true) {
    //         this.$message.error(getMessageByCode(data.data.code, this.$i18n.locale))
    //         return
    //       }
    //       for (let config of data.data.data) {
    //         if (config['key'] === 'zh_handbook') {
    //           this.zh_handbook = config['value']
    //         }
    //         if (config['key'] === 'en_handbook') {
    //           this.en_handbook = config['value']
    //         }
    //       }
    //       resolve(data.data.data)
    //     })
    //   })
    // },
    // opentapd (url) {
    //   window.open(url)
    // },
    // async showHelp () {
    //   await this.getSystemConfig()
    //   let url = this.zh_handbook
    //   if (this.$i18n.locale === 'en') {
    //     url = this.en_handbook
    //   }
    //   this.opentapd(url)
    // },
    showHelp () {
      let host = `${window.location.href.split('#')[0]}`
      if (this.$i18n.locale === 'zh') {
        window.open(`${host}UserManual/openatcAdmin/zh/index.html`)
      }
      if (this.$i18n.locale === 'en') {
        window.open(`${host}UserManual/openatcAdmin/en/index.html`)
      }
    },
    showVersion () {
      let versionInfoChild = this.$refs.versioninfoChild
      versionInfoChild.showMessage()
    },
    logout () {
      this.$store.dispatch('LogOut').then(() => {
        let href = location.href
        let index = href.indexOf('?')
        if (index > 0) {
          let hrefNew = href.substring(0, index)
          location.href = hrefNew
        }
        location.reload() // 为了重新实例化vue-router对象 避免bug
        this.FaultEventData.UnInit() // 取消故障事件订阅
      })
    },
    modifyPasswd () {
      let modifypasswdChild = this.$refs.modifypasswdChild
      // modifypasswdChild.onPasswdClick(this.userInfo.user_name)
      modifypasswdChild.onChangePassClick(this.userInfo.user_name)
    },
    // showSettings () {
    //   let settinngChild = this.$refs.settinngChild
    //   settinngChild.show()
    // },
    // showThirdPlatform () {
    //   let thirdPlatform = this.$refs.thirdPlatform
    //   thirdPlatform.show()
    // },
    setActive (path) {
      // 设置当前激活导航栏
      let currPath = path || this.$route.path
      for (let [key, value] of Object.entries(this.routerPath)) {
        if (currPath === value) {
          this.activeIndex = key
        }
      }
    },
    handleSaveTscParam () {
      if (!this.operateId) return
      // 存储baseEdge的参数tscParam进openATC维护的映射结构
      const tscParam = this.$store.getters.tscParam
      const curPath = this.$store.getters.curPath
      this.$store.dispatch('SaveMultDeviceData', [this.operateId, tscParam, curPath])
    },
    showInfo (val) {
      if (!val) return
      getInfo().then(data => {
        if (data.data.success !== true) {
          this.$message.error(getMessageByCode(data.data.code, this.$i18n.locale))
          return
        }
        this.userInfo = data.data.data
        let roleNames = this.userInfo.roleNames
        let notShowMenus = []
        if (!roleNames.includes('admin') && !roleNames.includes('superadmin')) {
          for (let role of roleNames) {
            notShowMenus = []
            if (role === 'expert') {
              notShowMenus.push('organization')
              notShowMenus.push('user')
              break
            } else {
              notShowMenus.push('organization')
              notShowMenus.push('user')
              notShowMenus.push('dutyRoute')
              notShowMenus.push('greenwave')
              notShowMenus.push('bottleneckcontrol')
            }
          }
        }
        this.notShowMenus = notShowMenus
      })
    },
    isShowMenu (menu) {
      let res = true
      if (this.notShowMenus.includes(menu)) {
        res = false
      }
      return res
    },
    switchLanguage (command) {
      switch (command) {
        case 'Ch':
          this.switchToChinese()
          break
        case 'En':
          this.switchToEngLish()
          break
        default:
          console.log(command)
          break
      }
    },
    switchTheme (command) {
      switch (command) {
        case 'dark':
          this.switchToDark()
          break
        case 'light':
          this.switchToLight()
          break
        default:
          console.log(command)
          break
      }
    },
    switchToDark () {
      setTheme('dark')
      location.reload()
    },
    switchToLight () {
      setTheme('light')
      location.reload()
    },
    switchToChinese () {
      this.$i18n.locale = 'zh'
      setLanguage(this.$i18n.locale)
      location.reload()
    },
    switchToEngLish () {
      this.$i18n.locale = 'en'
      setLanguage(this.$i18n.locale)
      location.reload()
    }
  }
}
</script>
<style lang="scss">
 //  @import "../../../styles/theme/element-variables.scss";
.el-menu-demo {
  padding: 0 18px;
}
.warnIcon {
  height: 24px;
  width: 24px;
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position:center center;
  background-image: url('../../../assets/home/trouble.png');
}
.openatc-operate {
  cursor: pointer;
  float: right;
  height: 52PX;
  line-height: 52PX;
  .admin {
    float: left;
  }
}
</style>
<style scoped>
.openatc-navbar >>> .iconfont {
    margin-right: 5PX;
    text-align: center;
    font-size: 14PX;
    line-height: 40PX;
}
</style>
